<template>
  <div>
    <footer>
      <div class="container footer_container">
        <dl class="item">
          <dt>企业服务</dt>
          <dd>
            <a href="">职位搜索</a>
            <a href="">新闻资讯</a>
            <a href="">Boos直聘App</a>
          </dd>
        </dl>
        <dl class="item">
          <dt>使用与帮助</dt>
          <dd>
            <a href="">职位搜索</a>
            <a href="">新闻资讯</a>
            <a href="">Boos直聘App</a>
          </dd>
        </dl>
        <dl class="item other">
          <div>
            <dt>联系boos直聘</dt>
            <dd>
              <a href="">职位搜索</a>
              <a href="">新闻资讯</a>
              <a href="">Boos直聘App</a>
            </dd>
          </div>
          <div class="right">
            <span>boss</span>
            <span>企业投诉</span>
          </div>
        </dl>
      </div>
    </footer>
  </div>
</template>

<script>
export default {
  name: 'HomeFooter',
  data () {
    return {}
  }
}
</script>

<style lang="scss" scoped>
footer {
  background-color: #ffffff;
  padding: 30px 0;

  .footer_container {
    display: flex;

    .item {
      width: 192px;

      dt {
        line-height: 30px;
        color: #414a60;
        padding-bottom: 10px;
      }

      dd {
        a {
          line-height: 24px;
          display: block;
          color: #8d92a1;
          font-size: 12px;
        }
      }
    }

    .other {
      flex: 1;
      display: flex;
      justify-content: space-between;
      .right{
        span{
          display: block;
        }
      }
    }
  }

}
</style>
